<template>
    <view>
        <u-sticky>
            <view class="" style="background-color: #F6F6F6;padding: 30rpx 0;overflow: hidden;">
                <view class="search">
                	<u-search placeholder="请输入咨询咨询师/咨询师名称" :showAction='false' bgColor='#fff' :focus='true' v-model="nickName" @search='search'>
                	</u-search>
                </view>
            </view>
        	
        </u-sticky>
       
        <view class="conbox">
        	<view class="counsel" v-for="(item,index) in counselor" :key="index"
        		@click="particular(item.userId)">
        		<view class="img">
        			<image :src="item.wxAvatar" mode="aspectFill"></image>
        		</view>
        		<view class="right">
        			<view class="namebox">
        				<view class="name">
        					{{item.nickName}}
        				</view>
        				<view class="pick">
        					<view class="v1">￥</view>
        					<view class="v2">{{item.price}}<text>起</text></view>
        				</view>
        			</view>
        			<scroll-view scroll-x="true" class="labelbox">
        				<view class="label" v-for="(itema,indexs) in item.goodWays" :key="indexs">
        					<view>
        						{{itema.title}}
        					</view>
        				</view>
        			</scroll-view>
        			<view class="evaluatebox">
        				<view class="evaleft">
        					<view class="appraise">
        						<u-rate :count="count" readonly gutter='1' size='13' v-model="item.score">
        						</u-rate>
        						<text>{{item.peopleCount}}人评价</text>
        					</view>
        					<view class="help">
        						帮助人数<text> {{item.helpPeople}}</text>
        					</view>
        				</view>
        				<view class="evaright" @click="privachat(item)">
        					<image src="../../../static/userSide/logo1.png" mode=""></image>
        				</view>
        			</view>
        
        		</view>
        	</view>
        </view>
        <view v-if="show"  style="padding-bottom: 100rpx;">
             <u-loadmore  :status="status" />
        </view>
    </view>
</template>

<script>
    import {getcommon} from '../../api/counselor.js'
    export default {
        data() {
            return {
                show:false,
                status: 'loading',
                counselor: [],
                count:5,
                nickName:'',
                pageNum: 1,
                pageSize: 40,
            };
        },
        onLoad() {
            this.get()
        },
        onReachBottom() {
                    this.show=true
        			this.pageNum=this.pageNum+1
        			setTimeout(() => {
        				this.get()
        			}, 1000)
        		},
        methods:{
            search(){
                this.pageNum=1
                this.counselor=[]
                console.log(this.nickName);
              this.get()
            },
            get(){
                let that=this
                let data={
                    pageNum:this.pageNum,
                    pageSize: this.pageSize,
                    nickName:this.nickName,
                }
                getcommon(data).then(res => {
                    console.log(res);
                   const count = res.data.total
                  if (that.counselor.length === count) {
                    that.status = 'nomore'
                    return
                  }
                  that.counselor = [...that.counselor,...res.data.rows]
                })
            },
            
            
            privachat(open) {
            	if (open.userId == this.$store.state.userInfo.wxInfo.uid) {
            		uni.showToast({
            			title: "不能和自己聊天",
            			icon: "none", //不要图标
            			duration: 3000 //显示时长
            		});
            	}else{
            		uni.navigateTo({
            			url: '/pages/userSide/privateChat?id=' + open.userId + "&ava=" + open.wxAvatar
            		})
            	}
            },
            particular(id) {
            	uni.navigateTo({
            		url: '/pages/userSide/particulars?id=' + id
            	})
            },
        }
        
    }
</script>

<style lang="scss">
.search {
			width: 92vw;
            margin: 0rpx auto;
		}

.conbox {
    width: 92vw;
    margin: 20rpx auto;
				.counsel {
					margin-top: 25rpx;
					display: flex;

					.img {
						margin-right: 30rpx;

						image {
							width: 200rpx;
							height: 200rpx;
						}
					}

					.right {
						width: 450rpx;

						.namebox {
							display: flex;
							justify-content: space-between;

							.name {
								font-size: 30rpx;
								font-weight: bold;
							}

							.pick {
								display: flex;
								color: #FF1A00;

								.v1 {
									font-size: 26rpx;
								}

								.v2 {
									font-size: 36rpx;
									font-weight: bold;

									text {
										font-size: 20rpx;
										font-weight: normal;
									}
								}
							}
						}

						.labelbox {
							width: 430rpx;
							margin: 0 0 15rpx;
							height: 55rpx;

							.label {
								display: inline-flex;

								view {
									color: #666;
									background-color: #EFF1FF;
									font-size: 20rpx;
									padding: 5rpx 10rpx;
									border-radius: 5rpx;
									margin-right: 10rpx;
								}
							}

						}

						.evaluatebox {
							display: flex;
							align-items: center;
							justify-content: space-between;

							.evaleft {
								.appraise {
									display: flex;

									text {
										color: #333;
										font-size: 24rpx;
									}
								}

								.help {
									margin-top: 20rpx;
									font-size: 24rpx;
									color: #999;

									text {
										color: #333;
									}
								}
							}

							.evaright {
								image {
									width: 72rpx;
									height: 72rpx;
								}
							}
						}
					}
				}

			}
</style>
